// 实例化VUE对象
new Vue({
	el:"#vue-app",
	data:{
		name:"whkgogo的征途",
		age:21,
		weixin:"wu290820",
		// time:"上午"
		input_type:"button",
		websit:"https://www.baidu.com",
		html_code:"<a href='https://www.baidu.com' target='_blank'>百度一下</a>",
		X:'',
		Y:'',
		msg:"",
		aaa:0,
		bbb:2
	},
	methods:{
		greet(time){
			// console.log("你好,VUE！")
			// 函数传入的参数直接使用就可以了，如果是data中的数据，则前面要加this
			return time + "好!" + this.name + "~"
		},
		add(add_num){
			 this.age += add_num;
			 // 这里不用添加return也可以进行实现
		},
		down(down_num){
			 this.age -= down_num;
		},
		get_position(event){
			this.X = event.offsetX,
			this.Y = event.offsetY
		},
		
		// 停止冒泡事件
		stopMove(event){
			event.stopPropagation()
		},
		
		a_goto(){
			alert("跳转到百度！")
		},
		
		iptName(){
			console.log("正在输入姓名")
		},
		
		iptAge(){
			console.log("正在输入年龄")
		},
		
		model_input(){
			// console.log(this.$refs.msg.value)
			this.msg = this.$refs.msg.value
		}
	},
	computed:{
		// 只有数据很大，或者是很费时间的操作才会使用computed,一般还是用methods
		addToA(){
			return this.aaa + this.age;
		},
		addToB(){
			return this.bbb + this.age
		}
	}
})

		// el是需要获取的元素，一定是HTML页面中的容器元素
		// data是用于存储数据
		// methods用于存储各种方法
